package com.acane.instagram.feature.collection

import android.annotation.SuppressLint
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.padding
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ArrowBack
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.material3.TopAppBarDefaults
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.sp
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.navigation.NavController

@Composable
fun CollectionRoute(
    collectionViewModel: CollectionViewModel = viewModel(),
    navController: NavController,
    toPost: (String, Int) -> Unit,
    toProfile: (String) -> Unit,
    toCollectionList: (Int) -> Unit,
) {
    CollectionScreen(
        collectionViewModel = collectionViewModel,
        navController = navController,
        toPost = toPost,
        toProfile = toProfile,
        toCollectionList = toCollectionList
    )
}

@SuppressLint("StateFlowValueCalledInComposition")
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun CollectionScreen(
    collectionViewModel: CollectionViewModel,
    navController: NavController,
    toPost: (String, Int) -> Unit,
    toProfile: (String) -> Unit,
    toCollectionList: (Int) -> Unit,
) {
    val gridPostList = collectionViewModel.postDatum.value
    Scaffold(
        topBar = {
            TopAppBar(
                title = {
                    Text(
                        text = "收藏帖子",
                        fontWeight = FontWeight.Bold,
                        fontSize = 20.sp,
                        color = Color.Black,
                    )
                },
                navigationIcon = {
                    IconButton(onClick = {
                        navController.popBackStack()
                    }) {
                        Icon(Icons.Default.ArrowBack, null)
                    }
                },
                actions = {

                },
                colors = TopAppBarDefaults.topAppBarColors(
                    containerColor = Color.White
                ),
            )
        },
        containerColor = Color.White,
    ) { padding ->
        Box(
            modifier = Modifier.padding(padding)
        ) {
            CollectionStaggeredGrid(
                coverList = gridPostList,
                viewModel = collectionViewModel,
                toCollectionList = toCollectionList,
            )
//            CollectionPostList(
//                toProfile = toProfile,
//                navController = navController,
//                userId = userId,
//                postPosition = postPosition,
//            )

        }
    }
}
